<template>
  <div>
    
   
   <router-view></router-view>
   <!--  -->
<mt-tabbar v-model="tabselected" fixed>
  <mt-tab-item id="index" index=''>
      <img v-if="tabselected=='index'" src="@/assets/common/main_1.png" slot="icon">
        <img v-else src="@/assets/common/main_0.png" slot="icon">
    首页
  </mt-tab-item>
  <mt-tab-item id="me">
 <img v-if="tabselected=='me'" src="@/assets/common/me_1.png" alt="" slot="icon">
   <img v-else src="@/assets/common/me_0.png" alt="" slot="icon">
    我的
  </mt-tab-item>
</mt-tabbar>

  </div>

</template>

<script>
export default {
  data() {
    return {
      //默认选择项应该是当前路径的末尾单词 /home/index
       tabselected: this.$route.path.split('/').pop()
    }
  },
    watch:{
    tabselected(newValue,oldValue){
      //  this.$router.push(`/${newValue}`)
      if(newValue=='index'){
        this.$router.push('/index')
      }else if(newValue='me'){
           this.$router.push('/me')
      }
    }
  }
};
</script>
<style scoped>
  .link{
    color:#fff
  }
</style>
